<template>
	<view>
		<view class="store_info">
			<view class="main">
				<view class="avatar">
					<image :src="store.user.avatarUrl" mode="aspectFill"></image>
				</view>
				<view class="info">
					<view class="fs30 fw">{{store.store_clerk.real_name}}</view>
					<view class="mt10">{{store.address}}</view>
					<view class="mt10">所属店铺：{{store.store_name}}</view>
				</view>
			</view>
		</view>
		<view class="fff_box">
			<view class="" style="display: flex;justify-content: space-around;margin-top: 50rpx;">
				<view class="" style="text-align: center;">
					<view class="" style="color: #1BAE61;font-weight: bold;font-size: 32rpx;">{{store.money}}</view>
					<view class="" style="margin-top: 20rpx;color: #777777;">可提现</view>
				</view>
				<view class="" style="text-align: center;">
					<view class="" style="color: #333333;font-weight: bold;font-size: 32rpx;">{{store.dj_money}}</view>
					<view class="" style="margin-top: 20rpx;color: #777777;">待提现</view>
				</view>
				<view class="" style="text-align: center;">
					<view class="" style="color: #333333;font-weight: bold;font-size: 32rpx;">{{store.use_money}}</view>
					<view class="" style="margin-top: 20rpx;color: #777777;">已提现</view>
				</view>
			</view>
			<button class="btn" @click="go_apply">去提现</button>
			<view class="mingxi" @click="go_list">提现明细</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				store: {},
			}
		},
		onShow() {
			this.getData()
		},
		methods: {
			go_apply(){
				uni.navigateTo({
					url:'/pages/mystore/apply'
				})
			},
			go_list(){
				uni.navigateTo({
					url:'/pages/mystore/list'
				})
			},
			getData() {
				let self = this;
				self._get('store.order/store', {}, function(res) {
					self.store = res.data
				});
			},
		}
	}
</script>

<style lang="scss" scoped>
	.mingxi {
		font-size: 24rpx;
		color: #1BAE61;
		text-align: center;
		line-height: 80rpx;
	}

	.btn {
		width: 600rpx;
		height: 80rpx;
		line-height: 80rpx;
		margin: 0 auto;
		margin-top: 50rpx;
		background-color: #1BAE61;
		color: #fff;
		font-size: 32rpx;
		border-radius: 40rpx;
	}

	.fff_box {
		width: 700rpx;
		margin: 0 auto;
		padding: 20rpx;
		box-sizing: border-box;
		border-radius: 16rpx;
		background-color: #fff;
		margin-top: -200rpx;

	}

	.fs30 {
		font-size: 30rpx;
	}

	.fw {
		font-weight: bold;
	}

	.store_info {
		width: 100%;
		height: 400rpx;
		background: linear-gradient(#1BAE61 75%, #F6F6F6);

		.main {
			display: flex;
			align-items: center;
			width: 700rpx;
			margin: 0 auto;
			padding-top: 40rpx;

			.avatar {
				width: 100rpx;
				height: 100rpx;

				image {
					width: 100rpx;
					height: 100rpx;
					border-radius: 50%;
				}
			}

			.info {
				flex: 1;
				padding-left: 20rpx;
				color: #fff;
				font-size: 22rpx;
			}
		}
	}
</style>